<script>
// import * as echarts from 'echarts'
export default {
    name: 'ECharts',
    data() {
        return {
            active: 1,
            // 排名轮播表
            scrollBoardConfiging: {
                header: ['企业名称', '整改时间', '企业代表', '整改内容'],
                data: [
                    ['积会环境处理公司', '2024-11-12 12:02', '李名', '空值质量治理达标'],
                    ['新环境环保公司', '2024-11-22 11:02','欧杨',  '绿化修缮达标' ],
                    [
                        '<span style="color:#FB5430;">绿园环境治理所</span>', 
                        '<span style="color:#FB5430;">2024-09-11 12:42</span>', 
                        '<span style="color:#FB5430;">刘家豪</span>',
                        '<span style="color:#FB5430;">空值质量治理达标</span>'
                    ],
                    ['大理石科技公司', '2024-11-12 12:02', '李杨', '空值质量治理达标'],
                    ['零氪环保公司', '2024-11-22 11:02','欧名',  '绿化修缮达标' ],
                    ['积会环境处理公司', '2024-11-12 12:02', '李家豪', '空值质量治理达标'],
                    ['新环境环保公司', '2024-11-22 11:02','刘改',  '绿化修缮达标' ],
                ],
                index: false,
                columnWidth: [180, 150, 120],
                align: ['left','left'],
                headerBGC: "#3490BA",//表头背景色
            },
            scrollBoardConfiged: {
                header: ['企业名称', '整改时间', '企业代表', '整改内容' ],
                data: [
                    ['智云废电池处理公司', '2024-11-12 12:02', '王一', '土壤检测改善' ],
                    ['叮飞空气检测有限公司', '2024-10-21 06:02', '吴东', '建筑空气净化' ],
                    ['好生活环境有限公司', '2024-11-11 17:34', '朱睿', '河道治理'],
                    ['新区环境治理所', '2024-11-18 21:36', '周杨', '环境申诉处理'],
                    ['雷蛇环保器械有限公司', '2024-10-08 08:00', '吴协', '空气净化机器测试'],
                ],
                index: false,
                columnWidth: [180, 150, 120],
                align: ['left','left'],
                headerBGC: "#3490BA",//表头背景色
            }
        }
    },
    mounted() {
        // this.initChart()
    },
    methods: {
        activeChange(key) {
            this.active = key
        }
    }
}
</script>
<template>
    <dv-border-box-11 style="width: 100%; height: 100%;">
        <div style="width: 100%; height: 100%;position: relative;">
            <div style="position: absolute;top: 18px;left: 50%;font-weight: 700;font-size: 18px;transform: translateX(-50%);">整改信息</div>
            <div style="padding: 40px 0 0 24px;display: flex;font-size: 15px;">
                <div :class="[ active === 1 ? 'active' : '' ]" style="margin-right: 15px;cursor: pointer;" @click="activeChange(1)">整改中</div>
                <div :class="[ active === 2 ? 'active' : '' ]" style="cursor: pointer;" @click="activeChange(2)">已完成</div>
            </div>
            <dv-scroll-board v-if="active === 1" :config="scrollBoardConfiging" style="width: 95%;height: 65%;position: absolute;top: 70px; left: 50%;transform: translateX(-50%);" />
            <dv-scroll-board v-else :config="scrollBoardConfiged" style="width: 95%;height: 65%;position: absolute;top: 70px; left: 50%;transform: translateX(-50%);" />
        </div>
    </dv-border-box-11>
</template>
<style scoped>
    .active{
        border-bottom: 2px solid #3490BA;
    }
</style>